// 旅客维护的弹框
import { Modal, Button } from 'antd';
import React, { useState } from 'react';
import Title from './Title'
import EditPassenger from './EditPassenger';
import { connect } from 'dva';
const { confirm } = Modal;



const PassengerListTable = props => {
    const { allDatas, passengerListTableShow, getFlightPaxInfoLoading, handleModalVisible, allPassengersList, getPassengersList } = props;
    const [selectRow, setSelectRow] = useState([])// 选中的项
    const [selectedRowKeys, setSelectedRowKeys] = useState([])// 选中项的id
    // 获取勾选的数据
    const getChildData = (keys, rows) => {
        setSelectedRowKeys(keys);
        setSelectRow(rows);
    }

    const okFun = ()=>{
        props.dispatch({
            type: 'auditDetail/changePassengers',
            payload: { passengers: selectRow }
        });
        props.dispatch({
            type: 'auditDetail/changePassengersIds',
            payload: { passengersIds: selectedRowKeys }
        });
        handleModalVisible(false);
    }

    const handleOk = () => {
        let showtips = false;
        for (let selectItem of selectRow) {
            if (selectItem.colorSign) {
                showtips = true;
                break; //跳出循环
            }
        }
        // 如果有一人多座，弹框提示。。没有就直接下一步
        if (showtips) {
            confirm({
                title: '已选择的旅客中有证件号相同购买多张机票的旅客，请核实是否继续添加旅客！',
                okText: '继续',
                onOk() {
                    okFun();
                },
                onCancel() {},
            }); 
        }else{
            okFun();
        }
        
    }
    const handleCancel = () => {
        handleModalVisible(false)
    }

    return (
        <>
            <Modal
                destroyOnClose={true}
                onCancel={handleCancel}
                maskClosable={false}
                keyboard={false}
                footer={
                    <div style={{ textAlign: 'center' }}>
                        <Button type="primary" style={{ marginRight: "30px" }} onClick={handleOk}>确定</Button>
                        <Button onClick={handleCancel}>取消</Button>
                    </div>
                }
                width={"90%"}
                title={[
                    <Title key="title" title={`${allDatas.flightNumber}航班旅客列表`} />
                ]}
                visible={passengerListTableShow}
            >
                <EditPassenger
                    allDatas={allDatas}
                    getPassengersList={getPassengersList}
                    getFlightPaxInfoLoading = {getFlightPaxInfoLoading}
                    getChildData={getChildData}
                    allPassengersList={allPassengersList}>
                </EditPassenger>
            </Modal>

        </>
    );
}

export default connect(state => state.auditDetail)(PassengerListTable);